<!DOCTYPE html>
<html lang="">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
    <title><%= webpackConfig.name %></title>
    <style>
        @charset "utf-8";

        /* reset */
        p,
        span,
        h1,
        h2,
        h3,
        h4,
        li {
            cursor: default;
            font-weight: normal;
        }

        body,
        div,
        dl,
        dt,
        dd,
        ul,
        ol,
        li,
        h1,
        h2,
        h3,
        h4,
        h5,
        h6,
        pre,
        code,
        form,
        fieldset,
        legend,
        textarea,
        p,
        blockquote,
        th,
        td,
        input,
        select,
        textarea,
        button {
            margin: 0;
            padding: 0
        }

        /* 初始化标签在所有浏览器中的margin、padding值 */
        fieldset,
        img {
            border: 0 none;
        }

        /* 重置fieldset（表单分组）、图片的边框为0*/
        dl,
        ul,
        ol,
        menu,
        li {
            list-style: none
        }

        /* 重置类表前导符号为onne,menu在HTML5中有效 */
        blockquote,
        q {
            quotes: none
        }

        /* 重置嵌套引用的引号类型 */
        blockquote:before,
        blockquote:after,
        q:before,
        q:after {
            content: '';
            content: none
        }

        /* 重置嵌套引用*/
        input,
        select,
        textarea,
        button {
            vertical-align: middle
        }

        /* 重置表单控件垂直居中*/
        button {
            border: 0 none;
            background-color: transparent;
            cursor: pointer
        }

        /* 重置表单button按钮效果 */
        body {
            background: #fff
        }

        /* 重置body 页面背景为白色 */
        body,
        th,
        td,
        input,
        select,
        textarea,
        button {
            font-size: 12px;
            line-height: 1;
            font-family: "微软雅黑", "黑体", "宋体";
            color: #666
        }

        /* 重置页面文字属性 */
        a {
            color: #666;
            text-decoration: none
        }

        /* 重置链接a标签 */
        a:active,
        a:hover {
            text-decoration: none
        }

        /* 重置链接a标签的鼠标滑动效果 */
        i,
        b,
        em {
            font-style: normal;
            font-weight: normal
        }

        /* 重置样式标签的样式 */
        caption {
            display: none;
        }

        /* 重置表格标题为隐藏 */
        table {
            width: 100%;
            border-collapse: collapse;
            border-spacing: 0;
            table-layout: fixed;
        }

        /* 重置table属性 */
        img {
            vertical-align: top
        }

        /* 图片在当前行内的垂直位置 */

        /* 页面设置 */

        /* 取消a标签点击后的虚线框 */
        a {
            outline: none;
        }

        /* 设置页面文字等在拖动鼠标选中情况下的背景色与文字颜色 */
        /*
      ::selection {color: #fff;background-color: #4C6E78;}
      ::-moz-selection {color: #fff;background-color: #4C6E78;}
      */
        /*浮动*/
        .fl {
            float: left;
        }

        .fr {
            float: right;
        }

        /*清除浮动*/
        .clear {
            clear: both;
        }

        /*清除浮动--推荐使用*/
        .clearfix:before,
        .clearfix:after {
            content: '';
            display: table;
        }

        .clearfix:after {
            clear: both;
        }

        /*为了兼容IE*/
        .clearfix {
            zoom: 1;
        }
    </style>
    <script>
        var _hmt = _hmt || [];
        (function () {
            var hm = document.createElement("script");
            hm.src = "https://hm.baidu.com/hm.js?913a55d118c808d63478dd3f9d244d53";
            var s = document.getElementsByTagName("script")[0];
            s.parentNode.insertBefore(hm, s);
        })();
    </script>
</head>

<body>
    <noscript>
        <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled.
            Please enable it to continue.</strong>
    </noscript>
    <div id="app"></div>
    <!-- built files will be auto injected -->
    <script>
        (function (designWidth, maxWidth) {
            var doc = document,
                win = window,
                docEl = doc.documentElement,
                remStyle = document.createElement("style"),
                tid;
            function refreshRem() {
                // document.getElementsByTagName("body")[0].style.cssText = "maxWidth:"+ maxWidth+"px;margin:0 auto";
                var width = docEl.clientWidth;
                maxWidth = maxWidth || 750;
                width > maxWidth && (width = maxWidth);
                var div = document.createElement('div');
                div.style.width = '1.4rem';
                div.style.height = '0';
                document.body.appendChild(div);
                var ideal = 140 * width / designWidth;
                var rem = width * 100 / designWidth;
                remStyle.innerHTML = 'html{font-size:' + rem + 'px;}';
                var rmd = (div.clientWidth / ideal);
                if (rmd > 0.8 && rmd < 1.2) { // 适配小米8 屏幕变宽或变窄
                    rmd = 1
                }
                rem = width * 100 / designWidth / rmd;
                remStyle.innerHTML = 'html{font-size:' + rem + 'px;}';
                document.body.removeChild(div);
            }

            if (docEl.firstElementChild) {
                docEl.firstElementChild.appendChild(remStyle);
            } else {
                var wrap = doc.createElement("div");
                wrap.appendChild(remStyle);
                doc.write(wrap.innerHTML);
                wrap = null;
            }
            //要等 wiewport 设置好后才能执行 refreshRem，不然 refreshRem 会执行2次；
            refreshRem();

            win.addEventListener("resize", function () {
                clearTimeout(tid); //防止执行两次
                tid = setTimeout(refreshRem, 300);
            }, false);

            win.addEventListener("pageshow", function (e) {
                if (e.persisted) { // 浏览器后退的时候重新计算
                    clearTimeout(tid);
                    tid = setTimeout(refreshRem, 300);
                }
            }, false);

            if (doc.readyState === "complete") {
                doc.body.style.cssText = "fontSize:16px;maxWidth:" + maxWidth + "px;margin:0 auto;";
            } else {
                doc.addEventListener("DOMContentLoaded", function (e) {
                    doc.body.style.cssText = "font-size:16px;max-width:" + maxWidth + "px;margin:0 auto;";
                }, false);
            }
        })(750, 750);
    </script>
</body>

</html>
<script>
    var _hmt = _hmt || [];
    (function() {
        var hm = document.createElement("script");
        hm.src = "https://hm.baidu.com/hm.js?3a8134915710cf2c3be2240c146ff1b0";
        var s = document.getElementsByTagName("script")[0];
        s.parentNode.insertBefore(hm, s);
    })();
</script>

